$(function(){
    //logo的滑动效果
    $("#logoPic").hover(
        function(){
            $(this).css({"cursor":"pointer"});
        }
    )
    //菜单栏的动画效果
    $("#logoUl1 li:gt(0)").hover(
        function(){
            $(this).css({"color":"#53cac3","cursor":"pointer"});
        },
        function(){
            $(this).css({"color":"black"});
        }
    );
    //"首页"的滑动设置
    $("#logoUl1 li:first-child").hover(
        function(){
            $(this).css({"color":"#53cac3","cursor":"pointer"});
        },
        function(){
            $(this).css({"color":"#53cac3"});
        }
    )
    //首页右侧的hover效果
    $(".icon1").hover(
        function(){
            $(".logoRight1").css({"top":"-20px"});
            $(this).css({"color":"#53cac3"});
            $(this).css("text-decoration","none")
        },
        function(){
            $(".logoRight1").css({"top":""});
            $(this).css({"color":""});
        }
    )
    $(".icon2").hover(
        function(){
            $(".logoRight2").css({"top":"-20px"});
            $(this).css({"color":"#53cac3"});
            $(this).css("text-decoration","none")
        },
        function(){
            $(".logoRight2").css({"top":""});
            $(this).css({"color":""});
        }
    )
    //判断滑动效果缩小导航栏
    window.onscroll=function(){
        var toTop= document.documentElement.scrollTop || document.body.scrollTop;
        //滚轮大于100的时候，导航栏的变化
        if(toTop>=100){
            $("#logo,#header").css({"height":"60px","padding-top":"0px","transition":"all 0.3s linear"});
            $("#logo img").css({"transform":"scale(0.7)","transition":"all 0.3s linear"})
        }else{
            $("#logo,#header").css({"height":"80px","padding-top":"20px","transition":"all 0.3s linear"});
            $("#logo img").css({"transform":"scale(1)","transition":"all 0.1s linear"})
        }
        //滑动到中间位置，显示手机等图片内容
        if(toTop>=700&&toTop<=1000){
            var mainText=document.getElementById("mainText");
            mainText.className="mainTextMove";
            var mainPhone=document.getElementById("phone");
            mainPhone.className="phoneMove";
            //手机图片上的logo动画
            var mainLogo=document.getElementById("mainLogo");
            mainLogo.className="mainLogoMove";
            //四条虚线的动画
            var mainLine=document.getElementById("mainLine");
            mainLine.className="mainLineMove";
            //给第一个图片加动画效果
            var mainPic1=document.getElementById("mainPic1");
            mainPic1.className="mainPic1Move";
            //给第二个图片加动画效果
            var mainPic2=document.getElementById("mainPic2");
            mainPic2.className="mainPic2Move";
            //给第三个图片加动画效果
            var mainPic3=document.getElementById("mainPic3");
            mainPic3.className="mainPic3Move";
            //给第四个图片加动画效果
            var mainPic4=document.getElementById("mainPic4");
            mainPic4.className="mainPic4Move";
            //改变四个图片的背景
            //修改第一个头像背景图片的值
            clearTimeout();
            setTimeout(function(){
                $("#mainPic1 img").attr({"src":"img/boss-1.png"});
                var img1=document.getElementById("img1");
                img1.className="img1Move";
            },1000);
            //修改第二个头像背景图片的值
            clearTimeout();
            setTimeout(function(){
                $("#mainPic2 img").attr({"src":"img/boss-2.png"});
                var img2=document.getElementById("img2");
                img2.className="img2Move";
            },2000);
            //修改第三个头像背景图片的值
            clearTimeout();
            setTimeout(function(){
                $("#mainPic3 img").attr({"src":"img/boss-3.png"});
                var img3=document.getElementById("img3");
                img3.className="img3Move";
            },3000);
            //修改第四个头像背景图片的值
            clearTimeout();
            setTimeout(function(){
                $("#mainPic4 img").attr({"src":"img/boss-4.png"});
                var img4=document.getElementById("img4");
                img4.className="img4Move";
            },4000);
        }
        //main第二部分内容滑动位置的时候添加的效果
        else if(toTop>=1400&&toTop<2500){
            //白色手机的设置
            var main2Left=document.getElementById("main2Left");
            main2Left.className="imgPhone";
            //右侧文字的设置
            var main2Right=document.getElementById("main2Right");
            main2Right.className="main2RightMove";
            //手机屏幕内容的滑动
            var whitePhoneInner=document.getElementById("whitePhoneInner");
            whitePhoneInner.className="whitePhoneMove";
            //弹框信息的显示
            var chatTip=document.getElementById("chatTip");
            chatTip.className="chatTipMove";
        }
        else if(toTop>=2500&&toTop<3470){
            //设置main3文字的滑动效果
            var main3Text=document.getElementById("main3Text");
            main3Text.className="main3TextMove";
            //给电脑图片添加滑动效果
            var main3Pic=document.getElementById("main3Pic");
            main3Pic.className="main3PicMove";
            //给小图标添加动画效果
            var baidu=document.getElementById("baidu");
            baidu.className="baiduMove";
            var meituan=document.getElementById("meituan");
            meituan.className="meituanMove";
            var didi=document.getElementById("didi");
            didi.className="didiMove";
            var jingdong=document.getElementById("jingdong");
            jingdong.className="jingdongMove";
            var ali=document.getElementById("ali");
            ali.className="aliMove";
            var tengxun=document.getElementById("tengxun");
            tengxun.className="tengxunMove";
        }
        //第四部分的添加动画
        else if(toTop>=3376&&toTop<4276){
            //左侧文字划入效果
            var main4Text=document.getElementById("main4Text");
            main4Text.className="main4TextMove";
            //添加右侧手机的移动划入
            var main4Phone=document.getElementById("main4Phone");
            main4Phone.className="main4PhoneMove";
            //设置黑色手机屏幕的动画效果
            var black1=document.getElementById("black1");
            black1.className="black1Move";
            var black2=document.getElementById("black2");
            black2.className="black2Move";
            var black3=document.getElementById("black3");
            black3.className="black3Move";
            var black4=document.getElementById("black4");
            black4.className="black4Move";
            var black5=document.getElementById("black5");
            black5.className="black5Move";
            var black6=document.getElementById("black6");
            black6.className="black6Move";
        }
        //第五部分的滑动设置
        else if(toTop>=4276&&toTop<5000){
            var main5Inner=document.getElementById("main5Inner");
            main5Inner.className="main5InnerMove";
        }
    }
    //banner部分文字的滑动
    window.onload=function(){
        var bannerText=document.getElementById("bannerText");
        bannerText.className="bannerTextMove";
    }
    //给输入框内添加文字，用计时器，2秒后添加
    setTimeout(function(){
        //修改placeholder的值
        $("#input1").attr({"placeholder":"职位、boss、公司"});
        $(".search").css({"display":"block"});
    },2000);
    //中间部分三块内容滑动的效果
    $("#mainUl").hover(
        function(){
            $("#li2").css({"transform": "scale(1)"});
        },
        function(){
            $("#li2").css({"transform": "scale(1.02)"});
        }
    )
    //第一块内容
    $("#li1").hover(
        function(){
            $("#li1Div2").css({"transform":"scale(1.02)","transition":"transform 0.3s linear"});

            $("#li1Div1").css({"display":"none"});
            $("#li1Div2").css({"display":"block"});

            $("#li2Div1").css({"display":"block"});
            $("#li2Div2").css({"display":"none"});

            $("#li3Div1").css({"display":"block"});
            $("#li3Div2").css({"display":"none"});
        },
        function(){
            $("#li1Div2").css({"transform":"scale(1)","transition":"transform 0.3s linear"});

            $("#li1Div1").css({"display":"block"});
            $("#li1Div2").css({"display":"none"});


            $("#li2Div1").css({"display":"none"});
            $("#li2Div2").css({"display":"block"});

            $("#li3Div1").css({"display":"block"});
            $("#li3Div2").css({"display":"none"});
        }
    )
    //第二块的内容
    $("#li2").hover(
        function(){
            $("#li2Div2").css({"transform":"scale(1.02)","transition":"transform 0.3s linear"});

            $("#li1Div1").css({"display":"block"});
            $("#li1Div2").css({"display":"none"});

            $("#li2Div1").css({"display":"none"});
            $("#li2Div2").css({"display":"block"});

            $("#li3Div1").css({"display":"block"});
            $("#li3Div2").css({"display":"none"});
        },
        function() {
            $("#li2Div2").css({"transform": "scale(1)","transition": "transform 0.3s linear"});

            $("#li1Div1").css({"display": "none"});
            $("#li1Div2").css({"display": "block"});

            $("#li2Div1").css({"display": "block"});
            $("#li2Div2").css({"display": "none"});

            $("#li3Div1").css({"display": "block"});
            $("#li3Div2").css({"display": "none"});

        }
    )
    //第三部分部分
    $("#li3").hover(
        function(){
            $("#li3Div2").css({"transform":"scale(1.02)","transition":"transform 0.3s linear"});
            $("#li3Div1").css({"display":"none"});
            $("#li3Div2").css({"display":"block"});

            $("#li2Div1").css({"display":"block"});
            $("#li2Div2").css({"display":"none"});

            $("#li1Div1").css({"display":"block"});
            $("#li1Div2").css({"display":"none"});


        },
        function(){
            $("#li3Div2").css({"transform":"scale(1)","transition":"transform 0.3s linear"});


            $("#li3Div1").css({"display":"block"});
            $("#li3Div2").css({"display":"none"});


            $("#li2Div1").css({"display":"none"});
            $("#li2Div2").css({"display":"block"});

            $("#li1Div1").css({"display":"block"});
            $("#li1Div2").css({"display":"none"});

        }
    )
    //四个老板图标滑动时候变换成公司图标
    //第一个图标
    $("#mainPic1").hover(
        function(){
            $("#mainPic1 img").attr("src","img/company-1.png");
        },
        function(){
            $("#mainPic1 img").attr("src","img/boss-1.png");
        }
    )
    //第二个图标
    $("#mainPic2").hover(
        function(){
            $("#mainPic2 img").attr("src","img/company-2.png");
        },
        function(){
            $("#mainPic2 img").attr("src","img/boss-2.png");
        }
    )
    //第三个图标
    $("#mainPic3").hover(
        function(){
            $("#mainPic3 img").attr("src","img/company-3.png");
        },
        function(){
            $("#mainPic3 img").attr("src","img/boss-3.png");
        }
    )
    //第四个图标
    $("#mainPic4").hover(
        function(){
            $("#mainPic4 img").attr("src","img/company-4.png");
        },
        function(){
            $("#mainPic4 img").attr("src","img/boss-4.png");
        }
    )
    //第五部分精灵图的hover效果
    $("#main5Logo1").hover(
        function(){
            $(this).css({"background-position":"-181px 0px"});
        },
        function(){
            $(this).css({"background-position":"0px 0px"});
        }
    )
    $("#main5Logo2").hover(
        function(){
            $(this).css({"background-position":"-181px -80px"});
        },
        function(){
            $(this).css({"background-position":" 0px -80px"});
        }
    )
    $("#main5Logo3").hover(
        function(){
            $(this).css({"background-position":"-181px -168px"});
        },
        function(){
            $(this).css({"background-position":"0px -168px"});
        }
    )
    $("#main5Logo4").hover(
        function(){
            $(this).css({"background-position":"-181px -246px"});
        },
        function(){
            $(this).css({"background-position":"0px -246px"});
        }
    )
    $("#main5Logo5").hover(
        function(){
            $(this).css({"background-position":"-181px -330px"});
        },
        function(){
            $(this).css({"background-position":"0px -330px"});
        }
    )
    $("#main5Logo6").hover(
        function(){
            $(this).css({"background-position":"-181px -405px"});
        },
        function(){
            $(this).css({"background-position":"0px -405px"});
        }
    )
    $("#main5Logo7").hover(
        function(){
            $(this).css({"background-position":"-181px -485px"});
        },
        function(){
            $(this).css({"background-position":"0px -485px"});
        }
    )
    $("#main5Logo8").hover(
        function(){
            $(this).css({"background-position":"-181px -562px"});
        },
        function(){
            $(this).css({"background-position":"0px -562px"});
        }
    )
    $("#main5Logo9").hover(
        function(){
            $(this).css({"background-position":"-181px -644px"});
        },
        function(){
            $(this).css({"background-position":"0px -644px"});
        }
    )
    $("#main5Logo10").hover(
        function(){
            $(this).css({"background-position":"-181px -726px"});
        },
        function(){
            $(this).css({"background-position":"0px -726px"});
        }
    )
    $("#main5Logo11").hover(
        function(){
            $(this).css({"background-position":"-181px -800px"});
        },
        function(){
            $(this).css({"background-position":"0px -800px"});
        }
    )
    $("#main5Logo12").hover(
        function(){
            $(this).css({"background-position":"-181px -882px"});
        },
        function(){
            $(this).css({"background-position":"0px -882px"});
        }
    )
    function autoLeft() {
        var transform = $(".company-list")[0].style.transform;
        var str = transform.match(/\((\S*)px/)[1];
        str == "-980" ? str = "0" : str = "-980";
        $(".company-list")[0].style.transitionDuration = "0.5s";
        $(".company-list")[0].style.transform = "translate3d(" + str + "px, 0px, 0px)";
        $(".company-list")[0].addEventListener("transitionend" || "webkitTransitionEnd", function () {
            $(".company-list")[0].style.transitionDuration = "0s";
            str == "0" ? str = "-1960" : str = "-980";
            $(".company-list")[0].style.transform = "translate3d(" + str + "px, 0px, 0px)";
        })
    }
    function autoRight() {
        var transform = $(".company-list")[0].style.transform;
        var str = transform.match(/\((\S*)px/)[1];
        str == "-980" ? str = "-1960" : str = "-2940";
        $(".company-list")[0].style.transitionDuration = "0.5s";
        $(".company-list")[0].style.transform = "translate3d(" + str + "px, 0px, 0px)";
        $(".company-list")[0].addEventListener("transitionend" || "webkitTransitionEnd", function () {
            $(".company-list")[0].style.transitionDuration = "0s";
            str == "-1960" ? str : str = "-980";
            $(".company-list")[0].style.transform = "translate3d(" + str + "px, 0px, 0px)";
        })
    }
    function scrollClass(target, top, cls) {
        if ($(window).scrollTop() >= top) {
            $(target).addClass(cls);
        }
    }
    $(function () {
        $(window).scroll(function () {
            $(this).scrollTop() > 100 ? $("#header").addClass("small-header") : $("#header").removeClass("small-header")
        })
        /* 第一个页面 开始 */
        $("#op_nav li").on("mouseenter", function () {
            $(this).addClass("cur").siblings().removeClass();
        })
        /* 第一个页面 结束 */
        /* 第二个页面 开始 */
        $(".boss-img").on("mouseenter", function () {
                $(this).hide().siblings("img").show();
            }
        )
        $(".company-img").on("mouseleave", function () {
                $(this).hide().siblings("img").show();
            }
        )
        /* 第二个页面 结束 */
        /* 自动轮播 开始 */
        var timer = setInterval(autoRight, 5000);
        /* 自动轮播 结束 */
        /* 底部轮播 开始 */
        $(".bx-prev").on("click", function () {
            clearInterval(timer);
            autoLeft();
        })
        $(".bx-next").on("click", function () {
            clearInterval(timer);
            autoRight();
        })
        /* 底部轮播 结束 */
        $(window).scroll(function () {
            /* 2 */
            scrollClass(".company-chat .text", 659, "fadeInDown animation");
            scrollClass(".company-chat .figure", 659, "fadeIn animation");
            /* 2 */
            /* 3 */
            scrollClass(".full-direcruit .text", 1615, "animation fadeInRight");
            scrollClass(".full-direcruit .figure", 1615, "animation fadeInLeft");
            /* 3 */
            /* 4 */
            scrollClass(".full-company .text", 2540, "animation fadeInDown");
            scrollClass(".full-company .figure-computer", 2540, "animation fadeInUp");
            scrollClass(".full-company .figure-logos  li", 2540, "animation fadeIn");
            /* 4 */
            /* 5 */
            scrollClass(".full-decent .text", 3465, "animation fadeInLeft");
            scrollClass(".full-decent .figure", 3465, "animation fadeInRight");
            /* 5 */
            /* 6 */
            scrollClass(".sec-other .mod-media", 4390, "animation fadeInDown");
            scrollClass(".sec-other .mod-always", 4390, "animation fadeIn");
            /* 6 */
        })

    })
});
